<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>列表组</title>
    <link href="bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div class="container">
        <ul class="list-group">
            <li class="list-group-item"><span class="badge">10</span>HellO</li>
            <li class="list-group-item">HellO</li>
            <li class="list-group-item"><a href="#">HellO</a></li>
            <li class="list-group-item">HellO</li>
            <li class="list-group-item">HellO</li>
            <li class="list-group-item">HellO</li>
            <li class="list-group-item">HellO</li>
        </ul>

        <br/>
        <br/>
        <div class="list-group">
            <a href="#" class="list-group-item active">hello</a>
            <a href="#" class="list-group-item">hello</a>
            <a href="#" class="list-group-item disabled">hello</a>
            <a href="#" class="list-group-item">hello</a>
            <a href="#" class="list-group-item">hello</a>
        </div>

        <br/>
        <br/>
        <div class="list-group">
            <a href="#" class="list-group-item active">hello</a>
            <a href="#" class="list-group-item list-group-item-success">hello</a>
            <a href="#" class="list-group-item disabled">hello</a>
            <a href="#" class="list-group-item list-group-item-warning">hello</a>
            <a href="#" class="list-group-item list-group-item-info">hello</a>
        </div>
        <br/>
        <br/>
        <div class="list-group">
            <a href="#" class="list-group-item">
                <img src="top2013_01.jpg" alt=""/>
                <h4 class="list-group-item-heading">消息处理</h4>
                <p class="list-group-item-text">这是一条关于天气的消息</p>
            </a>

        </div>
    </div>
</body>
</html>